<template>
	<view class="report_main">
		<u-notify ref="uNotify" message="Hi uView"></u-notify>
		<h4>体检报告</h4>
		<view class="report_main_">
			<view class="report_mains flex aic jcsb" v-for="(item,index) in datas" :key="index" v-if="datas.length!=0">
				<view class="flex report_mains_left flex aic">
					<image v-if="item.fileSuffix=='png'||item.fileSuffix=='jpg'" src="@/static/images.png" mode="">
					</image>
					<image v-else src="@/static/pdf.png" mode=""></image>
					<p class="fonts16 fontz report_mains_left_p">{{item.originalName}}</p>
				</view>
				<image src="../../../../static/delete.png" mode="" @click="deleteClick(item)"></image>
			</view>
			<view class="" v-if="datas.length==0">
				<Kong />
			</view>
		</view>
		<h4>无犯罪证明报告</h4>
		<view class="report_main_">
			<view class="report_mains flex aic jcsb" v-for="(item,index) in datas_F" :key="index" v-if="datas_F.length!=0">
				<view class="flex report_mains_left flex aic">
					<image v-if="item.fileSuffix=='png'||item.fileSuffix=='jpg'" src="@/static/images.png" mode="">
					</image>
					<image v-else src="@/static/pdf.png" mode=""></image>
					<p class="fonts16 fontz report_mains_left_p">{{item.originalName}}</p>
				</view>
				<image src="../../../../static/delete.png" mode="" @click="deleteClick_(item)"></image>
			</view>
			<view class="" v-if="datas_F.length==0">
				<Kong />
			</view>
		</view>
		
		<view class="position_footer flex aic jcsb">
			<view class="" style="width: 160px;">
				<UploadFileT @uploadImageClick="uploadImageClicks_" />
			</view>
			<view class="" style="width: 160px;">
				<UploadFileF @uploadImageClick="uploadImageClicks_F"/>
			</view>
		</view>
	</view>
</template>

<script>
	import UploadFileT from "@/pages/components/UploadFileT.vue"
	import UploadFileF from "@/pages/components/UploadFileF.vue"
	import Kong from "@/pages/components/Kong.vue"
	import {
		getposition,
		registration,
		collection,
		editRegistration,
	} from "@/api/index"
	export default {
		components: {
			UploadFileT,
			UploadFileF,
			Kong
		},
		data() {
			return {
				datas: [],
				datas_F: [],
				id: "",
				ids:""
			};
		},
		onLoad(options) {
			let data = JSON.parse(options.data)
			this.info(data)
		},
		methods: {
			info(data) {
				console.log(data);
				this.datas = data.positionRegistration.medicalReportFiles?data.positionRegistration.medicalReportFiles:[]
				this.datas_F = data.positionRegistration.noCriminalRecordFiles?data.positionRegistration.noCriminalRecordFiles:[]
				this.ids=data.id
				this.id = data.positionRegistration.id
				// console.log("info", this.datas);
			},
			deleteClick(item) {
				let filteredArray = this.datas.filter(obj => obj.ossId !== item.ossId);
				this.datas = filteredArray
				let obj = {
					medicalReportIds: this.stringFun(this.datas),
					id: this.id
				}
				this.editRegistrationApi(obj)
			},
			deleteClick_(item) {
				let filteredArray = this.datas_F.filter(obj => obj.ossId !== item.ossId);
				this.datas_F = filteredArray
				let obj = {
					noCriminalRecordIds: this.stringFun_(this.datas_F),
					id: this.id
				}
				this.editRegistrationApi(obj)
			},
			
			stringFun(data) {
				let medicalReportIds = ""
				for (let i = 0; i < data.length; i++) {
					if (i == 0) {
						medicalReportIds = data[i].ossId
					} else {
						medicalReportIds = medicalReportIds + "," + data[i].ossId
					}
				}
				return medicalReportIds
			},
			uploadImageClicks_(value) {
				console.log(value);
				let obj = {
					medicalReportIds: this.stringFun(this.datas),
					id: this.id
				}
				obj.medicalReportIds = obj.medicalReportIds ? obj.medicalReportIds + "," + value : value
				this.editRegistrationApi(obj)
			},
			stringFun_(data) {
				let noCriminalRecordIds = ""
				for (let i = 0; i < data.length; i++) {
					if (i == 0) {
						noCriminalRecordIds = data[i].ossId
					} else {
						noCriminalRecordIds = noCriminalRecordIds + "," + data[i].ossId
					}
				}
				return noCriminalRecordIds
			},
			uploadImageClicks_F(value) {
				console.log(value);
				let obj = {
					noCriminalRecordIds: this.stringFun_(this.datas_F),
					id: this.id
				}
				obj.noCriminalRecordIds = obj.noCriminalRecordIds ? obj.noCriminalRecordIds + "," + value : value
				this.editRegistrationApi(obj)
			},
			editRegistrationApi(params) {
				editRegistration(params).then(res => {
					this.getpositionApi(this.ids)
					this.$refs.uNotify.show({
						top: 0.1,
						type: 'success',
						color: '#ffffff',
						bgColor: '#5ac725',
						message: `${res.msg}`,
						duration: 1000 * 2,
						fontSize: 16,
						safeAreaInsetTop: false
					})
				}).catch(res => {
					this.$refs.uNotify.show({
						top: 0.1,
						type: 'error',
						color: '#ffffff',
						bgColor: '#f56c6c',
						message:  `${res.msg}`,
						duration: 1000 * 2,
						fontSize: 16,
						safeAreaInsetTop: false
					})
				})
			},
			// 获取
			async getpositionApi(params) {
				this.loading = true
				await getposition(params).then((res) => {
					this.loading = false
					console.log("个人信息：", res);
					this.info(res.data)
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.report_main {
		padding: 10px 12px 0px 12px;
		height: calc(100vh - 60px);
		background: #F8F9FA;
		position: relative;
		overflow-y: auto;

		&::-webkit-scrollbar {
			display: none;
			/*隐藏滚动轴*/
		}

		.report_mains {
			padding: 10px 10px;
			margin-bottom: 10px;
			// height: 66px;
			background: #FFFFFF;
			border-radius: 0px 0px 0px 0px;
			opacity: 1;

			.report_mains_left {
				image {
					width: 40px;
					height: 40px;
					margin-right: 10px;
				}
				.report_mains_left_p{
					max-width:240px;
					overflow: hidden;
					text-overflow:ellipsis;
					white-space: nowrap;
				}
			}

			image {
				width: 24px;
				height: 24px;
			}
		}
	}

	.report_main_ {
		margin-bottom: 70px;
	}

	.position_footer {
		height: 40px;
		z-index: 1;
		position: fixed;
		bottom: 0;
		background: #ffffff;
		box-shadow: 0px -1px 3px 0px rgba(48, 48, 48, 0.0592);
		border-radius: 0px 0px 0px 0px;
		opacity: 1;
		width: calc(100% - 24px);
		left: 0px;
		padding: 12px;

		.blue_btn {
			background: #2F6CBC;
			border: 1px solid #2F6CBC;
		}
	}
</style>
